 <template>
 	<view>
 		<map id="myMap" :markers="markers" :polyline="poyline" :longitude="center.longitude"
 			:latitude="center.latitude" :scale="15" style="width: 100%; height: 500px;"
 			@markertap="clickMarks($event)"></map>
			<!-- <audio :src="srcc" id="1213151515" :loop="true"></audio> -->
 	</view>
 </template>

 <script>
 	import QQMapWX from '../../common/qqmap-wx-jssdk.js' // 引入腾讯地图SDK

 	const qqMapSDK = new QQMapWX({
 		key: 'M5JBZ-XEZCJ-6SPFB-DH4E5-QFCS7-FCBTQ'
 	})

 	export default {
 		data() {
 			return {
 				center: {
 					longitude: 116.397470,
 					latitude: 39.908823
 				},
 				token: '', //语音token
				srcc:'',//语音路径
				text:'我是语音我是语音我是语音我是语音我是语音我是语音我是语音',//语音文本
 				map: null,
 				markers: [{
 						id: 1,
 						width: 40,
 						height: 40,
 						longitude: 116.397470,
 						latitude: 39.908823,
 						iconPath: 'https://img2.baidu.com/it/u=2826699317,3128715477&fm=253&fmt=auto&app=138&f=JPEG?w=529&h=500',
 					},
 					{
 						id: 2,
 						width: 40,
 						height: 40,
 						longitude: 116.414003,
 						latitude: 39.902632,
 						iconPath: 'https://img0.baidu.com/it/u=1467052035,1222001525&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1697562000&t=603feb359d0f99a34d7b66f1ddb4bd54'
 					},
 					{
 						id: 3,
 						width: 40,
 						height: 40,
 						longitude: 116.414003,
 						latitude: 39.982632,
 						iconPath: 'https://img0.baidu.com/it/u=1467052035,1222001525&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1697562000&t=603feb359d0f99a34d7b66f1ddb4bd54'
 					}
 				],
 				poyline: [] //路线规划
 			};
 		},
 		mounted() {
 			this.map = uni.createMapContext('myMap', this);
 			// 当前位置

 			qqMapSDK.reverseGeocoder({
 				success: res => {
 					this.markers[0].longitude = res.result.location.lng
 					this.markers[0].latitude = res.result.location.lat
 				}
 			})

 			this.audio()
 			// this.vadioo()
			this.getSrc()
 		},
 		methods: {
 			clickMarks(ev) {
 				const marker = this.markers.find(item => item.id === ev.detail.markerId)
 				console.log(marker.latitude);
 				console.log(marker.longitude);
 			},
 			// 计算距离
 			GetDistance(lat1, lng1, lat2, lng2) {
 				var radLat1 = lat1 * Math.PI / 180.0;
 				var radLat2 = lat2 * Math.PI / 180.0;
 				var a = radLat1 - radLat2;
 				var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
 				var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
 					Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
 				s = s * 6378.137; // EARTH_RADIUS;
 				s = Math.round(s * 10000) / 10000;
 				return s;
 			},

 			// 获取token
 			audio() {
 				let that = this
 				uni.request({
 					url: 'https://aip.baidubce.com/oauth/2.0/token',
 					data: {
 						grant_type: 'client_credentials',
 						client_id: 'BkZEIkHYY6puRLViv9kQ75tV',
 						client_secret: 'o3d3qXGpvv3tXjzx6VIPfhR4OXnd0hR4'
 					},
 					header: {
 						'Content-Type': 'application/x-www-form-urlencoded',
 					},
 					method: 'POST',
 					success: res => {
 						that.token = res.data.access_token
 						// console.log(that.token,'··········啊啊啊啊');
 					}
 				})
 			},
 			 vadioo() {
 			 	uni.request({
 					url: 'https://tsn.baidu.com/text2audio',
 					data: {
 						'tex': '都懂都懂',
 						'tok':'24.74ec04cb44681342bf5fd0bda809e11f.2592000.1700450729.282335-41281873',
 						'cuid': '8VsaICKXnLaU5k3RujExzJJZFPmvUAIq',
 						'ctp': '1',
 						'lan': 'zh',
 						'spd': 6,
 						'pit': 5,
 						'vol': 4,
 						'per': '1',
 						'aue': '3'
 					},
					header: {
						'Content-Type': 'application/x-www-form-urlencoded',
					},
					method: 'POST',
					success: res => {
						// console.log(res,'wwwww');
					}
 				})
 			},
			getSrc(){
				const innerAudioContext = uni.createInnerAudioContext();
				innerAudioContext.autoplay = true;
				innerAudioContext.src = `http://tsn.baidu.com/text2audio?tex=${this.text}签到成功&tok=${'24.d19cbe52cb663deb0691bf4d7ad9ec01.2592000.1700451017.282335-41281873'}&cuid=8VsaICKXnLaU5k3RujExzJJZFPmvUAIq&ctp=3&lan=zh&aue=3&ctp=1`
				innerAudioContext.onPlay(() => {
				  console.log('开始播放');
				});
				innerAudioContext.onError((res) => {
				  console.log(res.errMsg);
				  console.log(res.errCode);
				});
			}
 		},
 	};
 </script>

 <style>
 </style>